import { Store, StoreHandler } from "../../core";

import StoreProps from "./StoreProps";
import { useEffect, useState } from "react";

const useZoom = (store: Store<StoreProps>): { scale: number } => {
  const [scale, setScale] = useState(store.get("scale") || 0);

  const handleScaleChanged: StoreHandler<number> = (currentScale: number) => {
    setScale(currentScale);
  };

  useEffect(() => {
    store.subscribe("scale", handleScaleChanged);

    return () => {
      store.unsubscribe("scale", handleScaleChanged);
    };
  }, []);

  return { scale };
};

export default useZoom;
